<template>
  <div class="app-container">
    <el-form
      :model="queryParams"
      ref="queryForm"
      size="small"
      :inline="true"
      v-show="showSearch"
      label-width="68px"
    >
      <!-- <el-form-item label="" prop="sampleTalentInfoId">
        <el-input v-model="queryParams.sampleTalentInfoId" placeholder="达人信息表ID" clearable
          @keyup.enter.native="handleQuery" />
      </el-form-item> -->

      <el-form-item label="" prop="releaseTimeStart">
        <el-date-picker
          clearable
          v-model="queryParams.releaseTimeStart"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="请选择开始发布时间"
        >
        </el-date-picker>
      </el-form-item>
      -
      <el-form-item label="" prop="releaseTimeEnd">
        <el-date-picker
          clearable
          v-model="queryParams.releaseTimeEnd"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="请选择结束发布时间"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item label="" prop="isReport">
        <el-input
          v-model="queryParams.isReport"
          placeholder="是否报备"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="reportPriceStart">
        <el-input
          v-model="queryParams.reportPriceStart"
          placeholder="最低报备价格"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      -
      <el-form-item label="" prop="reportPriceEnd">
        <el-input
          v-model="queryParams.reportPriceEnd"
          placeholder="最高报备价格"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="platformFee">
        <el-input
          v-model="queryParams.platformFee"
          placeholder="平台费"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="rebate">
        <el-input
          v-model="queryParams.rebate"
          placeholder="返点"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="realPriceStart">
        <el-input
          v-model="queryParams.realPriceStart"
          placeholder="最低实际价格"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      -
      <el-form-item label="" prop="realPriceEnd">
        <el-input
          v-model="queryParams.realPriceEnd"
          placeholder="最高实际价格"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <!-- <el-form-item label="" prop="publishLink">
        <el-input v-model="queryParams.publishLink" placeholder="发布链接" clearable @keyup.enter.native="handleQuery" />
      </el-form-item> -->
      <el-form-item label="" prop="topicSelection">
        <el-input
          v-model="queryParams.topicSelection"
          placeholder="选题/植入场景"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="productNoStr">
        <el-input
          v-model="queryParams.productNoStr"
          placeholder="合作款式"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="noteFormat">
        <el-input
          v-model="queryParams.noteFormat"
          placeholder="笔记形式"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <!-- <el-form-item label="" prop="keywrodRanking">
        <el-input v-model="queryParams.keywrodRanking" placeholder="关键词排名" clearable @keyup.enter.native="handleQuery" />
      </el-form-item> -->

      <!-- <el-form-item label="逻辑删除;0=未删除；1=已删除" prop="isDelete">
        <el-input
          v-model="queryParams.isDelete"
          placeholder="逻辑删除;0=未删除；1=已删除"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item> -->
      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-search"
          size="mini"
          @click="handleQuery"
          >搜索</el-button
        >
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
          >重置</el-button
        >
        <el-button
          :icon="!isOpen ? 'el-icon-arrow-down' : 'el-icon-arrow-up'"
          size="mini"
          @click="shouqi"
          >展开/收起</el-button
        >
      </el-form-item>

      <div v-if="isOpen">
        <el-form-item label="" prop="commentMaintained">
          <el-input
            v-model="queryParams.commentMaintained"
            placeholder="评论区是否维护"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="brandWords">
          <el-input
            v-model="queryParams.brandWords"
            placeholder="是否添加品牌词"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="brandLocation">
          <el-input
            v-model="queryParams.brandLocation"
            placeholder="品牌词添加位置"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="shippingNotes">
          <el-input
            v-model="queryParams.shippingNotes"
            placeholder="是否带货笔记"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="readingVolume">
          <el-input
            v-model="queryParams.readingVolume"
            placeholder="阅读量"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="cpcCost">
          <el-input
            v-model="queryParams.cpcCost"
            placeholder="CPC点击成本"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="explosiveText">
          <el-input
            v-model="queryParams.explosiveText"
            placeholder="爆文属性"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="likeNum">
          <el-input
            v-model="queryParams.likeNum"
            placeholder="点赞"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="collectNum">
          <el-input
            v-model="queryParams.collectNum"
            placeholder="收藏"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="commentsNum">
          <el-input
            v-model="queryParams.commentsNum"
            placeholder="评论数"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="interactionsNum">
          <el-input
            v-model="queryParams.interactionsNum"
            placeholder="互动总数"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="cpeCost">
          <el-input
            v-model="queryParams.cpeCost"
            placeholder="CPE互动成本"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="interactionRate">
          <el-input
            v-model="queryParams.interactionRate"
            placeholder="互动率"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="gmv">
          <el-input
            v-model="queryParams.gmv"
            placeholder="GMV"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="hits">
          <el-input
            v-model="queryParams.hits"
            placeholder="点击量"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="clickRate">
          <el-input
            v-model="queryParams.clickRate"
            placeholder="点击率"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="additionalPurchases">
          <el-input
            v-model="queryParams.additionalPurchases"
            placeholder="加购数"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="orderNum">
          <el-input
            v-model="queryParams.orderNum"
            placeholder="下单数"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="purchaseRate">
          <el-input
            v-model="queryParams.purchaseRate"
            placeholder="加购率"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="" prop="isSettlement">
          <el-input
            v-model="queryParams.isSettlement"
            placeholder="是否结算"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
      </div>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5" style="display: none">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['product:note:add']"
          >新增</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['product:note:edit']"
          >修改</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['product:note:remove']"
          >删除</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['product:note:export']"
          >导出</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button plain icon="el-icon-edit" size="mini" @click="openContact"
          >寄样申请</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button plain icon="el-icon-edit" size="mini" @click="openPayApply"
          >申请资金</el-button
        >
      </el-col>
      <right-toolbar
        :showSearch.sync="showSearch"
        @queryTable="getList"
      ></right-toolbar>
    </el-row>
    <div ref="tableDom">
      <el-table
        v-loading="loading"
        :maxHeight="noteList.length ? tableHeight : 'auto'"
        :data="noteList"
        @selection-change="handleSelectionChange"
        @row-dblclick="t"
      >
        <el-table-column type="selection" width="55" align="center" />
        <el-table-column
          fixed
          label="笔记合作ID"
          align="center"
          prop="id"
          width="90"
        />
        <!-- <el-table-column fixed label="达人信息表ID" align="center" prop="sampleTalentInfoId" /> -->
        <el-table-column
          fixed
          label="达人层级"
          align="center"
          prop="talentLevel"
        />
        <el-table-column
          fixed
          label="昵称"
          align="center"
          prop="xhsNickname"
          width="180"
        />
        <el-table-column
          fixed
          label="对接人"
          align="center"
          prop="contactPerson"
        />
        <el-table-column label="平台名称" align="center" prop="platform" />
        <el-table-column
          label="人设类型/标签"
          align="center"
          prop="personnelType"
          width="110px"
        />
        <el-table-column label="主页链接" align="center" prop="homeLink">
          <template slot-scope="scope">
            <el-popover trigger="hover" placement="top" width="300">
              <!-- <span>{{ scope.row.customerProductTalking }}</span> -->
              <el-input
                v-model="scope.row.homeLink"
                :min-height="192"
                type="textarea"
                :autosize="{ minRows: 2, maxRows: 24 }"
                :style="{ width: '100%' }"
                :disabled="true"
              />
              <div slot="reference">
                <span class="textname">{{ scope.row.homeLink }} </span>
              </div>
            </el-popover>
          </template>
        </el-table-column>
        <el-table-column label="粉丝量(W)" align="center" prop="fansNum" />
        <el-table-column
          label="赞藏量(W)"
          align="center"
          prop="talentLikeNum"
        />
        <el-table-column
          label="发布时间"
          align="center"
          prop="releaseTime"
          width="100"
        >
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.releaseTime, "{y}-{m}-{d}") }}</span>
          </template>
        </el-table-column>
        <el-table-column label="是否报备" align="center" prop="isReport" />
        <el-table-column label="报备价格" align="center" prop="reportPrice" />
        <el-table-column label="平台费" align="center" prop="platformFee" />
        <el-table-column label="返点" align="center" prop="rebate" />
        <el-table-column label="实际价格" align="center" prop="realPrice" />
        <el-table-column
          label="合作款式"
          align="center"
          prop="productNoStr"
          width="180"
        />
        <!-- <el-table-column label="合作款式" align="center" prop="sampleTalentTemplateList" width="160px"
          :formatter="formatDatasampleTalentTemplateList" /> -->
        <el-table-column label="发布链接" align="center" prop="publishLink" />
        <el-table-column
          label="选题/植入场景"
          align="center"
          prop="topicSelection"
        />

        <el-table-column label="笔记形式" align="center" prop="noteFormat" />
        <el-table-column
          label="关键词排名"
          align="center"
          prop="keywrodRanking"
        />
        <el-table-column
          label="评论区是否维护"
          align="center"
          prop="commentMaintained"
        />
        <el-table-column
          label="是否添加品牌词"
          align="center"
          prop="brandWords"
        />
        <el-table-column
          label="品牌词添加位置"
          align="center"
          prop="brandLocation"
        />
        <el-table-column
          label="是否带货笔记"
          align="center"
          prop="shippingNotes"
        />
        <el-table-column label="阅读量" align="center" prop="readingVolume" />
        <el-table-column label="CPC点击成本" align="center" prop="cpcCost" />
        <el-table-column label="爆文属性" align="center" prop="explosiveText" />
        <el-table-column label="点赞" align="center" prop="likeNum" />
        <el-table-column label="收藏" align="center" prop="collectNum" />
        <el-table-column label="评论数" align="center" prop="commentsNum" />
        <el-table-column
          label="互动总数"
          align="center"
          prop="interactionsNum"
        />
        <el-table-column label="CPE互动成本" align="center" prop="cpeCost" />
        <el-table-column label="互动率" align="center" prop="interactionRate" />
        <el-table-column label="GMV" align="center" prop="gmv" />
        <el-table-column label="点击量" align="center" prop="hits" />
        <el-table-column label="点击率" align="center" prop="clickRate" />
        <el-table-column
          label="加购数"
          align="center"
          prop="additionalPurchases"
        />
        <el-table-column label="下单数" align="center" prop="orderNum" />
        <el-table-column label="加购率" align="center" prop="purchaseRate" />
        <el-table-column label="是否结算" align="center" prop="isSettlement" />
        <el-table-column label="备注" align="center" prop="remark" />
        <!-- <el-table-column label="逻辑删除;0=未删除；1=已删除" align="center" prop="isDelete" /> -->
        <el-table-column
          label="操作"
          align="center"
          class-name="small-padding fixed-width"
        >
          <template slot-scope="scope">
            <el-button
              size="mini"
              type="text"
              icon="el-icon-edit"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['product:note:edit']"
              >修改</el-button
            >
            <el-button
              size="mini"
              type="text"
              icon="el-icon-delete"
              @click="handleDelete(scope.row)"
              v-hasPermi="['product:note:remove']"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </div>

    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 添加或修改笔记合作管理对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="50%" append-to-body>
      <div class="el-dialog-div">
        <el-form ref="form" :model="form" :rules="rules" label-width="110px">
          <el-col :span="8">
            <!-- <el-form-item label="达人信息表ID" prop="sampleTalentInfoId">
              <el-input v-model="form.sampleTalentInfoId" placeholder="达人信息表ID" />
            </el-form-item> -->
            <el-form-item label="发布时间" prop="releaseTime" width="100px">
              <el-date-picker
                clearable
                v-model="form.releaseTime"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="请选择发布时间"
                style="width: 170px"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item label="是否报备" prop="isReport">
              <el-input v-model="form.isReport" placeholder="是否报备" />
            </el-form-item>
            <el-form-item label="报备价格" prop="reportPrice">
              <el-input v-model="form.reportPrice" placeholder="报备价格" />
            </el-form-item>
            <el-form-item label="平台费" prop="platformFee">
              <el-input v-model="form.platformFee" placeholder="平台费" />
            </el-form-item>
            <el-form-item label="返点" prop="rebate">
              <el-input v-model="form.rebate" placeholder="返点" />
            </el-form-item>
            <el-form-item label="实际价格" prop="realPrice">
              <el-input v-model="form.realPrice" placeholder="实际价格" />
            </el-form-item>
            <el-form-item label="发布链接" prop="publishLink">
              <el-input v-model="form.publishLink" placeholder="发布链接" />
            </el-form-item>
            <el-form-item label="选题/植入场景" prop="topicSelection">
              <el-input
                v-model="form.topicSelection"
                placeholder="选题/植入场景"
              />
            </el-form-item>
            <!-- <el-form-item label="合作款式" prop="cooperativeStyle">
              <el-input v-model="form.cooperativeStyle" placeholder="合作款式" />
            </el-form-item> -->
            <el-form-item label="笔记形式" prop="noteFormat">
              <el-input v-model="form.noteFormat" placeholder="笔记形式" />
            </el-form-item>
            <el-form-item label="关键词排名" prop="keywrodRanking">
              <el-input
                v-model="form.keywrodRanking"
                placeholder="关键词排名"
              />
            </el-form-item>
            <el-form-item label="评论区是否维护" prop="commentMaintained">
              <el-input
                v-model="form.commentMaintained"
                placeholder="评论区是否维护"
              />
            </el-form-item>
            <el-form-item label="是否添加品牌词" prop="brandWords">
              <el-input
                v-model="form.brandWords"
                placeholder="是否添加品牌词"
              />
            </el-form-item>
            <el-form-item label="品牌词添加位置" prop="brandLocation">
              <el-input
                v-model="form.brandLocation"
                placeholder="品牌词添加位置"
              />
            </el-form-item>
            <el-form-item label="是否带货笔记" prop="shippingNotes">
              <el-input
                v-model="form.shippingNotes"
                placeholder="是否带货笔记"
              />
            </el-form-item>
            <el-form-item label="阅读量" prop="readingVolume">
              <el-input v-model="form.readingVolume" placeholder="阅读量" />
            </el-form-item>
          </el-col>
          <el-col :span="1">
            <el-form-item></el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="CPC点击成本" prop="cpcCost">
              <el-input v-model="form.cpcCost" placeholder="CPC点击成本" />
            </el-form-item>
            <el-form-item label="爆文属性" prop="explosiveText">
              <el-input v-model="form.explosiveText" placeholder="爆文属性" />
            </el-form-item>
            <el-form-item label="点赞" prop="likeNum">
              <el-input v-model="form.likeNum" placeholder="点赞" />
            </el-form-item>
            <el-form-item label="收藏" prop="collectNum">
              <el-input v-model="form.collectNum" placeholder="收藏" />
            </el-form-item>
            <el-form-item label="评论数" prop="commentsNum">
              <el-input v-model="form.commentsNum" placeholder="评论数" />
            </el-form-item>
            <el-form-item label="互动总数" prop="interactionsNum">
              <el-input v-model="form.interactionsNum" placeholder="互动总数" />
            </el-form-item>
            <el-form-item label="CPE互动成本" prop="cpeCost">
              <el-input v-model="form.cpeCost" placeholder="CPE互动成本" />
            </el-form-item>
            <el-form-item label="互动率" prop="interactionRate">
              <el-input v-model="form.interactionRate" placeholder="互动率" />
            </el-form-item>
            <el-form-item label="GMV" prop="gmv">
              <el-input v-model="form.gmv" placeholder="GMV" />
            </el-form-item>
            <el-form-item label="点击量" prop="hits">
              <el-input v-model="form.hits" placeholder="点击量" />
            </el-form-item>
            <el-form-item label="点击率" prop="clickRate">
              <el-input v-model="form.clickRate" placeholder="点击率" />
            </el-form-item>
            <el-form-item label="加购数" prop="additionalPurchases">
              <el-input
                v-model="form.additionalPurchases"
                placeholder="加购数"
              />
            </el-form-item>
            <el-form-item label="下单数" prop="orderNum">
              <el-input v-model="form.orderNum" placeholder="下单数" />
            </el-form-item>
            <el-form-item label="加购率" prop="purchaseRate">
              <el-input v-model="form.purchaseRate" placeholder="加购率" />
            </el-form-item>
            <el-form-item label="是否结算" prop="isSettlement">
              <el-input v-model="form.isSettlement" placeholder="是否结算" />
            </el-form-item>
            <el-form-item label="备注" prop="remark">
              <el-input v-model="form.remark" placeholder="备注" />
            </el-form-item>
            <!-- <el-form-item label="逻辑删除;0=未删除；1=已删除" prop="isDelete">
          <el-input v-model="form.isDelete" placeholder="逻辑删除;0=未删除；1=已删除" />
        </el-form-item> -->
          </el-col>
          <el-col :span="1">
            <el-form-item></el-form-item>
          </el-col>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitForm">确 定</el-button>
          <el-button @click="cancel">取 消</el-button>
        </div>
      </div>
    </el-dialog>
    <!-- 寄样申请 -->
    <el-dialog
      title="寄样申请"
      :visible.sync="openCon"
      width="500px"
      append-to-body
      v-if="openCon"
    >
      <el-form
        ref="Contact"
        :model="Contact"
        :rules="rules"
        label-width="120px"
      >
        <el-form-item label="请选择收件地址" prop="address">
          <el-select v-model="Contact.id" @change="changeContact">
            <el-option
              v-for="item in optionsContact"
              :key="item.id"
              :label="`${item.recipient},${item.phone},${item.receiverState}${item.receiverCity}${item.receiverDistrict}${item.address}`"
              :value="item.id"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="是否归还" prop="isReturn">
          <!-- <el-input v-model="Contact.isReturn" placeholder="是否归还" /> -->
          <el-select
            v-model="Contact.isReturn"
            placeholder="请选择是否归还"
            clearable
            filterable
          >
            <el-option
              v-for="dict in dict.type.sys_one_zero"
              :key="dict.value"
              :label="dict.label"
              :value="dict.label"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="快递公司" prop="expressCompany">
          <!-- <el-input v-model="Contact.expressCompany" placeholder="快递公司" /> -->
          <el-select
            v-model="Contact.expressCompany"
            placeholder="请选择快递公司"
            clearable
            filterable
          >
            <el-option
              v-for="dict in dict.type.sys_jst_sample_sf"
              :key="dict.label"
              :label="dict.label"
              :value="dict.label"
            />
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitContact">确 定</el-button>
        <el-button @click="cancelContact">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 资金申请 -->
    <el-dialog
      title="申请资金"
      :visible.sync="openPay"
      width="500px"
      append-to-body
      v-if="openPay"
    >
      <el-form ref="Pay" :model="Pay" :rules="rules" label-width="120px">
        <el-form-item label="请选择支付方式" prop="address">
          <el-select v-model="Pay.id">
            <el-option
              v-for="item in optionsPay"
              :key="item.id"
              :label="item.payMethod"
              :value="item.id"
            />
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitPay">确 定</el-button>
        <el-button @click="cancelPay">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listSamplePaymentApply,
  getSamplePaymentApply,
  delSamplePaymentApply,
  addSamplePaymentApply,
  updateSamplePaymentApply,
} from "@/api/sample/samplePaymentApply";
import { listPay, getPay, delPay, addPay, updatePay } from "@/api/sample/pay";
import {
  listContact,
  getContact,
  delContact,
  addContact,
  updateContact,
} from "@/api/sample/contact";
import {
  listSampleApply,
  getSampleApply,
  delSampleApply,
  addSampleApply,
  updateSampleApply,
  addApply,
} from "@/api/sample/sampleApply";
import {
  listNote,
  getNote,
  delNote,
  addNote,
  updateNote,
} from "@/api/sample/note";

export default {
  name: "Note",
  dicts: ["sys_one_zero", "sys_sample_sf", "sys_jst_sample_sf"],
  data() {
    return {
      tableHeight: "",
      //支付申请
      openPay: false,
      optionsPay: [],
      Pay: {},
      //寄样
      openCon: false,
      optionsContact: [],
      Contact: {
        isReturn: "是",
        expressCompany: "中通快递",
      },
      //搜索栏展示和收起
      isOpen: false,
      //选中get
      sample: [],
      list: [],

      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 笔记合作管理表格数据
      noteList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        sampleTalentInfoId: null,
        releaseTime: null,
        isReport: null,
        reportPrice: null,
        platformFee: null,
        rebate: null,
        realPrice: null,
        publishLink: null,
        topicSelection: null,
        cooperativeStyle: null,
        noteFormat: null,
        keywrodRanking: null,
        commentMaintained: null,
        brandWords: null,
        brandLocation: null,
        shippingNotes: null,
        readingVolume: null,
        cpcCost: null,
        explosiveText: null,
        likeNum: null,
        collectNum: null,
        commentsNum: null,
        interactionsNum: null,
        cpeCost: null,
        interactionRate: null,
        gmv: null,
        hits: null,
        clickRate: null,
        additionalPurchases: null,
        orderNum: null,
        purchaseRate: null,
        isSettlement: null,
        isDelete: null,
        productNoStr: null,
        releaseTimeStart: null,
        releaseTimeEnd: null,
        reportPriceStart: null,
        reportPriceEnd: null,
        realPriceStart: null,
        realPriceEnd: null,
      },

      // 表单参数
      form: {},
      // 表单校验
      rules: {
        sampleTalentInfoId: [
          { required: true, message: "达人信息表ID不能为空", trigger: "blur" },
        ],
        address: [
          { required: true, message: "收货地址不能为空", trigger: "blur" },
        ],
      },
    };
  },
  created() {
    this.getList();
  },
  mounted() {
    var _this = this;
    this.resizeTable();
    window.onresize = function () {
      _this.resizeTable();
    };
  },
  //记得清空  如果在keepalive中 则使用activated  deactivated
  destroyed() {
    window.onresize = null;
  },
  methods: {
    //搜索栏展示与收起
    shouqi() {
      // console.log(1);
      this.isOpen = !this.isOpen;
    },
    //点击某一行
    t(row, column, cell, event) {
      console.log(row, column, cell, event);
      this.handleUpdate(row);
    },
    openPayApply() {
      if (this.sample.length > 1 || this.sample.length == 0) {
        this.$modal.msgError("请选择一个达人！");
        return;
      }
      listPay({ sampleTalentInfoId: this.sample[0] }).then((res) => {
        if (res.rows.length == 0) {
          this.$modal.msgError("请添加达人支付信息！");
          return;
        } else if (res.rows.length > 0) {
          this.optionsPay = res.rows;
          console.log(JSON.stringify(this.optionsPay));
          this.openPay = true;
        }
      });
    },
    cancelPay() {
      this.openPay = false;
    },

    submitPay() {
      if (!this.Pay.id) {
        this.$modal.msgError("请选择达人支付方式！");
        return;
      }

      // return
      console.log(JSON.stringify(this.list));
      // for (var item in this.list) {
      //   if (item == 'sampleTalentTemplateList') {
      //     delete this.list[item];
      //   }
      // }
      var note = {};
      // // this.list.map(info => info.sampleTalentTemplateList)
      for (let i = 0; i < this.list.length; i++) {
        //   var info = this.list[i]
        //   // console.log(JSON.stringify(info.sampleTalentTemplateList));
        //   // note = this.list.map(info => info.sampleTalentTemplateList)
        //   // note.push(info.sampleTalentTemplateList)
        //   for (let j = 0; j < info.sampleTalentTemplateList.length; j++) {
        //     // const element = array[j];
        // note.assign({ sampleTalentInfoId: this.list[i].sampleTalentInfoId, sampleTalentPayId: this.Pay.id })
        // note[sampleTalentInfoId] = this.list[i].sampleTalentInfoId
        // note[sampleTalentPayId] = this.Pay.id
        note = {
          businessId: this.list[i].id,
          sampleTalentInfoId: this.list[i].sampleTalentInfoId,
          sampleTalentPayId: this.Pay.id,
          businessType: "note",
        };
      }

      // }
      // if (note.length == 0) {
      //   this.$modal.msgError("请选择合作款式！");
      //   return
      // }

      console.log(JSON.stringify(note));
      // return

      addSamplePaymentApply(note).then((response) => {
        if (response.code == 200) {
          this.$modal.msgSuccess("申请成功");
          this.$router.push({
            path: "/sample/samplePaymentApply",
            query: { id: this.sample[0] },
          });
          // this.getList()
        }
      });
    },
    openContact() {
      if (this.sample.length > 1 || this.sample.length == 0) {
        this.$modal.msgError("请选择一个达人！");
        return;
      }
      listContact({ sampleTalentInfoId: this.sample[0] }).then((res) => {
        if (res.rows.length == 0) {
          this.$modal.msgError("请添加达人收件信息！");
          return;
        } else if (res.rows.length > 0) {
          this.optionsContact = res.rows;
          console.log(JSON.stringify(this.optionsContact));
          this.openCon = true;
        }
      });
    },
    cancelContact() {
      this.openCon = false;
    },
    changeContact(val) {
      console.log(val);
      console.log(this.Contact.id);
    },
    submitContact() {
      if (!this.Contact.id) {
        this.$modal.msgError("请选择达人收件地址！");
        return;
      }

      console.log(JSON.stringify(this.list));
      var note = [];
      var productNoStr = [];
      this.list.forEach((info) => {
        productNoStr.push({
          productNoStr: info.productNoStr,
          sampleTalentInfoId: info.sampleTalentInfoId,
          sampleTalentCooperateId: info.id,
        });
      });
      console.log(JSON.stringify(productNoStr));
      for (let i = 0; i < productNoStr.length; i++) {
        var info = productNoStr[i].productNoStr.split("|");
        console.log(JSON.stringify(info));
        for (let j = 0; j < info.length; j++) {
          note.push({
            productNo: info[j],
            sampleTalentInfoId: productNoStr[i].sampleTalentInfoId,
            sampleTalentCooperateId: productNoStr[i].sampleTalentCooperateId,
            sampleTalentCooperateType: "note",
            contactId: this.Contact.id,
            isReturn: this.Contact.isReturn,
            expressCompany: this.Contact.expressCompany,
          });
        }
      }
      console.log(JSON.stringify(note));

      // for (let i = 0; i < this.list.length; i++) {
      //   var info = this.list[i]
      //   // console.log(JSON.stringify(info.sampleTalentTemplateList));
      //   // note = this.list.map(info => info.sampleTalentTemplateList)
      //   // note.push(info.sampleTalentTemplateList)
      //   for (let j = 0; j < info.sampleTalentTemplateList.length; j++) {

      //     note.push({ ...info.sampleTalentTemplateList[j], contactId: this.Contact.id, isReturn: this.Contact.isReturn, expressCompany: this.Contact.expressCompany })

      //   }
      // }
      if (note.length == 0) {
        this.$modal.msgError("请选择合作款式！");
        return;
      }
      console.log(JSON.stringify(note));
      // return
      addApply(note).then((response) => {
        if (response.code == 200) {
          this.$modal.msgSuccess("申请成功");
          this.$router.push({
            path: "/sample/sampleApply",
            query: { id: this.sample[0] },
          });
          // this.getList()
        }
      });
    },
    formatDatasampleTalentTemplateList(row) {
      let rowPerson = (row && row.sampleTalentTemplateList) || [];
      let arr = [];
      rowPerson.forEach((item) => {
        //如果数据特别多的话,还可以在这里加if判断,仅展示规定的数据
        arr.push(item.productNo);
      });
      //
      return arr.join("/");
    },
    /** 查询笔记合作管理列表 */
    getList() {
      this.loading = true;
      listNote(this.queryParams).then((response) => {
        this.noteList = response.rows;
        console.log(JSON.stringify(this.noteList));
        this.total = response.total;
        this.loading = false;
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        sampleTalentInfoId: null,
        releaseTime: null,
        isReport: null,
        reportPrice: null,
        platformFee: null,
        rebate: null,
        realPrice: null,
        publishLink: null,
        topicSelection: null,
        cooperativeStyle: null,
        noteFormat: null,
        keywrodRanking: null,
        commentMaintained: null,
        brandWords: null,
        brandLocation: null,
        shippingNotes: null,
        readingVolume: null,
        cpcCost: null,
        explosiveText: null,
        likeNum: null,
        collectNum: null,
        commentsNum: null,
        interactionsNum: null,
        cpeCost: null,
        interactionRate: null,
        gmv: null,
        hits: null,
        clickRate: null,
        additionalPurchases: null,
        orderNum: null,
        purchaseRate: null,
        isSettlement: null,
        remark: null,
        isDelete: null,
        createBy: null,
        createTime: null,
        updateBy: null,
        updateTime: null,
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.id);
      this.list = selection.map((item) => item);
      console.log(JSON.stringify(this.list));
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
      var sampleTalentInfoId = selection.map((item) => item.sampleTalentInfoId);
      console.log(JSON.stringify(Array.from(new Set(sampleTalentInfoId))));
      this.sample = Array.from(new Set(sampleTalentInfoId));
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加笔记合作管理";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const id = row.id || this.ids;
      getNote(id).then((response) => {
        this.form = response.data;
        console.log(JSON.stringify(this.form));
        this.open = true;
        this.title = "修改笔记合作管理";
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.id != null) {
            updateNote(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addNote(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.id || this.ids;
      this.$modal
        .confirm('是否确认删除笔记合作管理编号为"' + ids + '"的数据项？')
        .then(function () {
          return delNote(ids);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download(
        "product/note/export",
        {
          ...this.queryParams,
        },
        `note_${new Date().getTime()}.xlsx`
      );
    },
    // table自动高度
    returnTableHeight(ref, bottomOffset) {
      let height = null;
      height =
        window.innerHeight - ref.getBoundingClientRect().top - bottomOffset;
      return height;
    },
    resizeTable() {
      this.$nextTick(() => {
        this.tableHeight = this.returnTableHeight(this.$refs.tableDom, 100);
      }, 0);
    },
  },
};
</script>
<style lang="scss" scoped>
.el-dialog-div {
  height: 80vh;
  overflow-x: hidden;
}

span.textname {
  display: -webkit-box;

  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  white-space: pre-wrap;
}

.el-textarea.is-disabled ::v-deep .el-textarea__inner {
  color: #606266;
  background-color: white;
  border: none;
  width: 500px;
  resize: none;
  cursor: pointer;
}
</style>